/*全布局容器*/
@mixin ly-group($l:0,$t:0,$r:0,$b:0 ) {
  @if ($l != false) {
    left: $l;
  }
  @if ($t != false) {
    top: $t;
  }
  @if ($b != false) {
    bottom: $b;
  }
  @if ($r !=false) {
    right: $r;
  }
}


/*绝对布局容器*/
@mixin abs-group($l:0,$t:0,$r:0,$b:0 ) {
  @include ly-group($l,$t,$r,$b );
  position:absolute;
}

/*基本变化动画*/
@mixin transform-m($t:all,$dur:0.3s ,$func:linear,$delay:0s){
  transition:$t $dur $func $delay;
  -moz-transition:$t $dur $func $delay;
  -webkit-transition:$t $dur $func $delay;
  -o-transition:$t $dur $func $delay;
}

/*阴影*/
@mixin shadow($xf:3px,$yf:3px,$dis:7px,$cor:rgba(0, 0, 0, .07),$blur:0){
  -webkit-box-shadow: $xf $yf $dis $cor;
  -moz-box-shadow: $xf $yf $dis $cor;
  box-shadow: $xf $yf $dis $cor;
}

/*渐变*/
@mixin light-radial( $cor:rgba(0, 154, 220, .3),$cor2:rgba(0, 154, 220, 0) ,$cor3:rgba(0, 154, 220, 0)){
  background-image: radial-gradient($cor, $cor2,$cor3);
}

/*渐变*/
@mixin bg-linear($s,$e,$dir:right,$sp:0%,$ep:100%){
  background: -webkit-linear-gradient($dir, $s $sp, $e $ep);
  background: -o-linear-gradient($dir, $s $sp, $e $ep);
  background: -moz-linear-gradient($dir, $s $sp, $e $ep);
  background: linear-gradient(to $dir, $s $sp, $e $ep);
  background: -webkit-gradient(linear, top left, top right, color-stop($sp,$s), color-stop($ep,$e));
  background: -ms-linear-gradient($dir, $s $sp, $e $ep);
}

/*flex布局*/
@mixin layout-flex( $dir:column , $hor:start ,$ver:start){
  display:flex ;
  display: -webkit-box;  /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
  display: -moz-box;     /* 老版本语法: Firefox (buggy) */
  display: -ms-flexbox;  /* 混合版本语法: IE 10 */
  display: -webkit-flex; /* 新版本语法: Chrome 21+ */

  flex-direction: $dir;
  -ms-flex-direction:$dir;

  @if ($hor == center) {
    justify-content:center ;
  }
  @if ($hor == start) {
    justify-content:flex-start ;
  }
  @if ($hor == end) {
    justify-content:flex-end ;
  }
  -ms-flex-pack:$hor;
  @if ($ver == center) {
    align-items:center;
  }
  @if ($ver == start) {
    align-items:flex-start;
  }
  @if ($ver == end) {
    align-items:flex-end;
  }
  -ms-flex-align:$ver;
}

@mixin ly-grow(){
  align-items:stretch;
}

/*垂直布局*/
@mixin ver-group($hor:start ,$ver:start){
  @include layout-flex( column , $ver   ,$hor) ;
}
/*水平布局*/
@mixin hor-group($hor:start ,$ver:center){
  @include layout-flex( row , $hor  ,$ver ) ;
}
/*水平布局*/
@mixin tile-group($hor:start ,$ver:center){
  display:flex ;
  display: -webkit-box;  /* 老版本语法: Safari, iOS, Android browser, older WebKit browsers. */
  display: -moz-box;     /* 老版本语法: Firefox (buggy) */
  display: -ms-flexbox;  /* 混合版本语法: IE 10 */
  display: -webkit-flex; /* 新版本语法: Chrome 21+ */

  flex-direction:row;
  flex-wrap: wrap;/*flex-flow: row wrap;*/
  -ms-flex-wrap:wrap;

  justify-content: flex-start;
  -ms-flex-pack:start;

  align-items:flex-start;
  -ms-flex-align:start;

  align-content: flex-start;
  overflow:hidden;
}


/*动画*/
@mixin effect-all($prop:all,$time:300ms,$func:linear,$delay:0s){
  transition: $prop $time $func $delay;
}


/*透明输入框*/
@mixin trans-input($w:100%,$h:25px,$fl:auto){
  background-color:transparent;
  height:$h;
  line-height:$h;
  width:$w;
  flex:$fl;
  border:none;
  outline:none;
  padding: 0 3px;
  vertical-align: middle;
}


/*透明输入框*/
@mixin trans-auto( ){
  background-color:transparent;
  border:none;
  outline:none;
}

@mixin dis-selected(){
  -webkit-user-select:none;
  -moz-user-select:none;
  -ms-user-select:none;
  user-select:none;
}


/* temp */
@mixin text-dot(){
  overflow: hidden;
  word-break: keep-all;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* temp */
@mixin padding-rem($top:0,$right:0,$bottom:0,$left:0){
  padding-top:$top;
  padding-bottom:$bottom;
  padding-left:$left;
  padding-right:$right;
  box-sizing: border-box;
}


/* temp */
@mixin border-radius($topLeft:0,$topRight:0,$bottomRight:0,$bottomLeft:0){
  border-top-left-radius:$topLeft;
  border-top-right-radius:$topRight;
  border-bottom-left-radius:$bottomLeft;
  border-bottom-right-radius:$bottomRight;
}

/* 两端对齐 */
@mixin v-ly-between(){
  justify-content: space-between;
}


/* temp? */
@mixin v-trans-no-bor(){
  background: transparent;
  color:#000 ;
  border:none;
  outline: none;
}

/* 编辑视图 保证1366尺寸 1920尺寸可视区域更大 */
@function px($value) {
  @return $value/1920*1366;
}


/* 旋转 */
@mixin  v-rotate( $num , $origin:0 0){
  transform: rotate($num );
  transform-origin:$origin;

  -ms-transform: rotate($num ); 		/* IE 9 */
  -ms-transform-origin:$origin; 		/* IE 9 */

  -webkit-transform: rotate($num );	/* Safari 和 Chrome */
  -webkit-transform-origin:$origin;	/* Safari 和 Chrome */

  -moz-transform: rotate($num );		/* Firefox */
  -moz-transform-origin:$origin;		/* Firefox */

  -o-transform: rotate($num );		/* Opera */
  -o-transform-origin:$origin;
}

/* temp */
@mixin v-use-select($flag:none) {
  -webkit-user-select: $flag;
  -moz-user-select: $flag;
  -ms-user-select:  $flag;
  user-select: $flag;
}
